<template>
  <div id="author" :class="{nightBg:isNight}">
    <div class="avatar">
      <div class="img"><img src="@/assets/img/ft.jpg"></img></div>
      <p>我是一个代码酱</p>
    </div>
    <div class="tags">
      <el-tag>热爱生活</el-tag>
      <el-tag>热爱学习</el-tag>
      <el-tag>热爱工作</el-tag>     
    </div>
  </div>
</template>

<script>
  export default {
    data(){
      return{
        isNight:false
      }
    },
    created(){
      //判断当前时间
      let hour = new Date().getHours()
      if(hour > 6 && hour < 18){
        this.isNight = false
      }else{
        this.isNight = true
      }
    }
  }
</script>

<style scoped>
  .nightBg{
    background-color: #292929 !important;
    box-shadow: 0px 0px 0px #000 !important;
  }
  #author{
    text-align:center;
    margin-bottom:35px;
    padding-top:40px;
  }
  .avatar{
    /* margin-top:30px; */
    font-size:1.2rem;
    font-family:FZYaoti;
  }
  .avatar .img{
    height:70px;
    width:70px;
    border-radius:50%;
    background-color: white;
    margin-left:89px;
  }
  .avatar .img img{
    display:inline-block;
    width:40px;
    height:40px;
    margin-top:15px;
  }
  .avatar p{
    margin-top:12px;
    margin-bottom:16px;
  }
  .el-tag{
    margin-left:5px;
    margin-bottom:5px;
    cursor:pointer;
  }
  .el-tag:first-child{
    margin-left:0;
  }
</style>